<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/common/taglibs.jsp" %>
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>靓淘网-登录</title>
		<link rel="stylesheet" type="text/css" href="${ctx}/static/front/CSS/login_style.css" />
	</head>

	<body>
		<div class="top_center">
			<div class="left">
				<img src="${ctx}/static/front/img/LOGO.png" />
			</div>
			<div class="right">
				<ul>
					<li class="top_seven">7天无理由退换货</li>
					<li class="top_real">100%正品保证</li>
					<li class="top_back">退货返运费</li>
				</ul>
			</div>
			<div class="clearfix"></div>
		</div>
		<div class="banner">
			<img class="banner_img" src="${ctx}/static/front/img/beijing.png" />
			<div class="banner_center">
				<div class="login">
					<form>
						<ul>
							<li class="login_title_1">
								<a href="">密码登录</a>

							</li>
							<li class="login_title_2">
								<a href="">扫码登录</a>
							</li>
							<li>
								<input class="login_user" type="text" id="username" placeholder="会员名/邮箱/手机号" />
								<input class="login_password" type="password" id="password" placeholder="密码" />
								<input class="login_btn" onclick="submitForm()" type="button" value="登录" />
							</li>
							<li class="login_select">
								<a class="weibo" href="">微博登录</a>
								<a class="zhifubao" href="">支付宝登录</a><br />
							</li>
							<li class="renmenber_user">
								<input type="checkbox" value="remer_user" id="remer_user" />
								<label for="remer_user">记住用户名</label>
							</li>
							<li class="login_bottom">
								<a href="">忘记密码</a>
								<a href="">免费注册</a>
							</li>
						</ul>
					</form>
				</div>
			</div>
			<div class="clearfix"></div>
		</div>
		<div class="link">
			<ul>
				<li>
					<a href="">
						关于靓淘
					</a>
				</li>
				<li>
					<a href="">
						帮助中心
					</a>
				</li>
				<li>
					<a href="">
						开放平台
					</a>
				</li>
				<li>
					<a href="">
						诚聘精英
					</a>
				</li>
				<li>
					<a href="">
						联系我们
					</a>
				</li>
				<li>
					<a href="">
						网站合作
					</a>
				</li>
				<li>
					<a href="">
						法律声明及隐私政策
					</a>
				</li>
				<li>
					<a href="">
						知识产权
					</a>
				</li>
				<li>
					<a href="">
						廉政举报
					</a>
				</li>
				<li>
					<a href="">
						规则意见征集
					</a>
				</li>
			</ul>
		</div>
		<div class="copyright">
			COPYRIGHT 2010-2017 北京创锐文化传媒有限公司 JUMEI.COM 保留一切权利. 客服热线：400-123-888888<br /> 京公网安备 110101020011226|京ICP证111033号|食品流通许可证 SP1101051110165515（1-1）|营业执照
		</div>
		
		<script src="${ctx}/static/back/js/jquery.min.js?v=2.1.4"></script>
		<script src="${ctx}/static/common/mylayer.js"></script>
        <script src="${ctx}/static/common/util.js"></script>
        <script src="${ctx}/static/lib/layui/layui.js"></script>
        
        <script>
        	layui.use(['layer'],function () {
        		var layer = layui.layer;
        		//layer.msg("hello");
        	});
        </script>	
        <script type="text/javascript">
        	function submitForm() {
        		/* 1、验证用户名
        		1.1、用户名不能为空
        		1.2、是否合法：4-8位数字或字母(这个暂时先去掉吧)
        		2、密码不能为空
        		3、ajax提交用户名和密码，根据后台返回的ServerResponse决定进行什么操作 */
        		var username = $("#username").val();
        		var password = $("#password").val();
        		// 1.1、用户名不能为空
        		if(util.isNull(username)) {
        			mylayer.errorMsg("用户名不能为空");
        			return;
        		}
        		// 1.2、是否合法：4-8位数字或字母
        		/* var pattern = /^[0-9a-zA-Z]{4,8}$/;
        		if(!pattern.test(username)) {
        			mylayer.errorMsg("格式非法，请输入4-8位数字或字母");
        			return;
        		} */
        		//2、密码不能为空
        		if(util.isNull(password)) {
        			mylayer.errorMsg("密码不能为空");
        			return;
        		}
        		
        		//3、ajax提交用户名和密码，根据后台返回的ServerResponse决定进行什么操作
        		$.ajax({
        			url:"${ctx}/user/login.shtml",
        			//$("#login_form").serialize()
        			data:{"username":username,"password":password},
        			type:"post",
        			dataType:"json",
        			success:function(resp) {
        				if(resp.code == util.SUCCESS){
        					mylayer.successUrl(resp.msg,"${ctx}/index.shtml");
      					} else {
        					mylayer.errorMsg(resp.msg);
        				}
        			}
        		});
        		
        	}
        </script>
	</body>

</html>